<?php
/**
 * AI 主题侧边栏 - 专注 AI 功能
 */
?>

<aside class="space-y-6">
    <!-- AI 内容创作助手 -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="relative overflow-hidden p-6">
            <!-- 背景装饰 -->
            <div class="absolute top-0 right-0 w-32 h-32 transform translate-x-16 -translate-y-16">
                <div class="absolute inset-0 bg-gradient-to-br from-blue-500/20 to-purple-600/20 blur-3xl"></div>
            </div>
            
            <div class="relative space-y-4">
                <!-- 图标 -->
                <div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl flex items-center justify-center shadow-lg">
                    <i data-lucide="sparkles" class="w-8 h-8 text-white"></i>
                </div>
                
                <!-- 标题和描述 -->
                <div>
                    <h3 class="text-lg font-semibold text-gray-900">AI 内容创作助手</h3>
                    <p class="text-sm text-gray-500 mt-1">
                        智能生成高质量文章，优化SEO，提升创作效率
                    </p>
                </div>
                
                <!-- 代码片段选择 -->
                <div class="space-y-2">
                    <label class="block text-sm font-medium text-gray-700">选择编程语言</label>
                    <select class="w-full px-3 py-2 text-sm bg-gray-50 border border-gray-200 rounded-lg
                                 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500/30">
                        <option value="php">PHP</option>
                        <option value="javascript">JavaScript</option>
                        <option value="python">Python</option>
                        <option value="java">Java</option>
                        <option value="go">Go</option>
                        <option value="rust">Rust</option>
                    </select>
                </div>
                
                <!-- 功能列表 -->
                <div class="space-y-2">
                    <div class="flex items-center gap-2 text-sm text-gray-600">
                        <i data-lucide="check-circle-2" class="w-4 h-4 text-green-500"></i>
                        <span>代码片段生成</span>
                    </div>
                    <div class="flex items-center gap-2 text-sm text-gray-600">
                        <i data-lucide="check-circle-2" class="w-4 h-4 text-green-500"></i>
                        <span>代码优化建议</span>
                    </div>
                    <div class="flex items-center gap-2 text-sm text-gray-600">
                        <i data-lucide="check-circle-2" class="w-4 h-4 text-green-500"></i>
                        <span>多语言转换</span>
                    </div>
                </div>
                
                <!-- 按钮 -->
                <button class="w-full px-4 py-2.5 text-sm font-medium text-white
                             bg-gradient-to-r from-blue-500 to-purple-600
                             rounded-xl transition-all duration-300
                             hover:from-blue-600 hover:to-purple-700
                             focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2
                             shadow-lg shadow-purple-500/25">
                    开始创作
                </button>
            </div>
        </div>
    </div>

    <!-- AI 私有模型训练 -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="relative overflow-hidden p-6">
            <!-- 背景装饰 -->
            <div class="absolute top-0 right-0 w-32 h-32 transform translate-x-16 -translate-y-16">
                <div class="absolute inset-0 bg-gradient-to-br from-purple-500/20 to-pink-600/20 blur-3xl"></div>
            </div>
            
            <div class="relative space-y-4">
                <!-- 图标 -->
                <div class="w-16 h-16 bg-gradient-to-br from-purple-500 to-pink-600 rounded-2xl flex items-center justify-center shadow-lg">
                    <i data-lucide="brain" class="w-8 h-8 text-white"></i>
                </div>
                
                <!-- 标题和描述 -->
                <div>
                    <h3 class="text-lg font-semibold text-gray-900">训练私有 AI 模型</h3>
                    <p class="text-sm text-gray-500 mt-1">
                        基于您的代码库训练专属 AI 模型，提供更精准的代码建议
                    </p>
                </div>
                
                <!-- 代码库统计 -->
                <div class="grid grid-cols-2 gap-3">
                    <div class="p-3 bg-gray-50 rounded-xl">
                        <div class="text-2xl font-semibold text-gray-900">1.2k</div>
                        <div class="text-xs text-gray-500">代码片段</div>
                    </div>
                    <div class="p-3 bg-gray-50 rounded-xl">
                        <div class="text-2xl font-semibold text-gray-900">8</div>
                        <div class="text-xs text-gray-500">支持语言</div>
                    </div>
                </div>
                
                <!-- 训练状态 -->
                <div class="p-3 bg-gray-50 rounded-xl space-y-2">
                    <div class="flex items-center justify-between text-sm">
                        <span class="text-gray-600">模型训练进度</span>
                        <span class="text-gray-900 font-medium">68%</span>
                    </div>
                    <div class="w-full h-2 bg-gray-200 rounded-full overflow-hidden">
                        <div class="h-full w-[68%] bg-gradient-to-r from-emerald-500 to-blue-600 rounded-full"></div>
                    </div>
                </div>
                
                <!-- 按钮 -->
                <button class="w-full px-4 py-2.5 text-sm font-medium text-white
                             bg-gradient-to-r from-purple-500 to-pink-600
                             rounded-xl transition-all duration-300
                             hover:from-purple-600 hover:to-pink-700
                             focus:outline-none focus:ring-2 focus:ring-pink-500 focus:ring-offset-2
                             shadow-lg shadow-pink-500/25">
                    开始训练
                </button>
            </div>
        </div>
    </div>
</aside> 